Recipe 개발 환경

Recipe 파일을 성공적으로 열었다면, 이제 본격적인 개발을 위한 작업 공간(Workspace)을 마주하게 됩니다. 이 챕터에서는 Recipe 개발 화면을 구성하는 각 패널의 역할과 주요 기능을 상세히 둘러봅니다. 각 영역의 기능을 정확히 이해하면 훨씬 효율적으로 Recipe를 개발할 수 있습니다.

---

1. 메인 화면 구성

Recipe 개발 화면은 크게 5개의 핵심 영역으로 나뉩니다. 각 영역은 유기적으로 연결되어 있으며, 사용자의 필요에 따라 크기를 조절하거나 위치를 변경할 수 있습니다.

① 순서도(Flowchart) 영역: Recipe의 전체적인 흐름을 시각적으로 설계하고 편집하는 공간입니다. ② 코드(Code) 영역: 순서도와 대응되는 Python 코드를 확인하고, 사용자 정의 함수를 작성하는 텍스트 편집 공간입니다. ③ 모듈/변수/속성 영역: Recipe 구성에 필요한 모듈을 선택하고, 변수를 관리하며, 각 모듈의 세부 속성을 설정하는 공간입니다. ④ 출력/결과 이미지 영역: Recipe 실행 및 디버깅 과정에서 발생하는 메시지와 결과 이미지를 확인하는 공간입니다. ⑤ 이미지 영역: 결과 이미지를 선택하여 상세하게 확대/분석하는 공간입니다.

---

2. 순서도(Flowchart) 편집 영역

순서도 영역은 Recipe의 구조를 직관적으로 파악하고 편집할 수 있는 공간입니다. 이곳에서 모듈을 배치하고, 데이터 흐름을 연결하며, 전체 로직을 시각적으로 설계합니다.

기본 조작

• 모듈 추가: 왼쪽 '모듈' 패널에서 원하는 모듈을 드래그 앤 드롭하여 순서도에 배치합니다.
• 모듈 연결: 한 모듈의 **Output 포트(오른쪽 원)**를 클릭하여 다른 모듈의 **Input 포트(왼쪽 원)**로 드래그하면 데이터 흐름이 연결됩니다. 연결선은 데이터의 타입을 색상으로 구분하여 표시합니다.
• 모듈 선택 및 이동: 모듈을 클릭하여 선택하고, 드래그하여 원하는 위치로 자유롭게 이동할 수 있습니다. 다수의 모듈을 Ctrl 키를 누른 채 클릭하거나, 마우스로 드래그하여 영역을 지정하면 여러 모듈을 동시에 선택할 수 있습니다.
• 모듈 종류 : 모듈명과 모듈 키 이름을 확인할 수 있습니다.

상단 툴바 기능

순서도 상단에는 모듈 정렬과 보기 설정을 위한 다양한 도구가 있습니다.

맞춤 및 정렬 설정

여러 모듈을 선택한 후, 아래 버튼을 클릭하여 빠르고 깔끔하게 정렬할 수 있습니다.

• 화면 맞춤: 순서도에 배치된 모든 모듈이 한눈에 들어오도록 전체적인 배율과 위치를 자동으로 조정합니다.

  

• 세로 정렬 (왼쪽, 가운데, 오른쪽): 선택된 모듈들을 수직 축을 기준으로 정렬합니다.

  

• 가로 정렬 (위쪽, 가운데, 아래쪽): 선택된 모듈들을 수평 축을 기준으로 정렬합니다.

  

보기 옵션

체크박스를 통해 순서도에 표시될 추가 정보를 선택할 수 있습니다.

• 주석 보기: 체크 시, 모듈에 작성된 주석 아이콘과 제목이 표시됩니다. 아이콘에 마우스를 올리면 상세 내용을 툴팁으로 확인할 수 있습니다.

  

• 좌표 보기: 체크 시, 각 모듈의 좌측 상단에 해당 모듈의 위치를 나타내는 X, Y 좌표가 표시됩니다.

  

• 이미지 보기: 체크 시, Recipe 실행/디버깅 후 각 모듈의 Output 이미지 결과가 썸네일 형태로 모듈 아래에 표시됩니다.

  

• 색상정보 보기: 체크 시, Input/Output 데이터 타입별 색상 정보를 나타내는 범례(Legend)가 순서도 화면에 표시됩니다.

  

모듈 상태 표시

디버깅 중 모듈의 상태는 특별한 아이콘으로 표시됩니다.

• 중단점(Breakpoint): 사용자가 실행을 멈추기 위해 설정한 위치입니다. 모듈 우측 상단에 핑크색 아이콘으로 표시됩니다.
• 현재 실행 위치: 디버깅 중 현재 실행이 멈춰있는 위치를 나타냅니다. 모듈 우측 상단에 초록색 아이콘으로 표시됩니다.

우클릭 컨텍스트 메뉴

모듈을 우클릭하면 다양한 편의 기능을 사용할 수 있습니다.

• 메인/사용자 정의로 이동: 해당 모듈에 해당하는 코드 라인으로 코드 영역에서 즉시 이동합니다.
• 사용자 정의로 이동: 선택한 모듈의 사용자 정의 함수 창 내의 코드 위치로 이동합니다. 사용자 정의 함수를 포함한 모듈 선택 시에만 가능합니다.
• 속성으로 이동: 선택한 모듈의 Input 항목을 모듈 속성 영역으로 이동합니다.
• 이름 변경: 모듈의 고유 키(Key) 이름을 변경합니다.
• 상세 보기: 모듈의 원본 소스 코드(.py) 파일을 별도의 창으로 열어 확인합니다.
• 모듈 이미지 뷰어: (디버깅 중에만 활성화) 모듈의 결과 이미지를 별도의 뷰어 창에서 보면서, 실시간으로 파라미터를 변경하고 결과 변화를 즉시 확인할 수 있는 기능입니다.
• 그룹: 두 개 이상의 모듈을 선택하여 그룹을 생성합니다. 그룹 이름을 설정할 수 있으며, 그룹 내에서 모듈간의 Input/Output 포트를 선택할 수 있습니다.
• 그룹 해제: 생성한 모듈 그룹을 선택하고 해당 그룹을 해제합니다.
• 주석 추가: 선택한 모듈들에 대한 주석을 추가하여 설정 팝업창에서 제목과 내용을 작성하고, 주석 색상을 설정합니다. 주로 두 개 이상의 모듈을 선택하여 Recipe의 해당 부분에 대한 참고 내용을 작성합니다.
• 중단점 추가/삭제: 해당 모듈에 중단점을 설정하거나 해제합니다.
• 이미지 분석: Recipe 실행이나 디버깅을 통해 도출된 이미지를 선택하여 해당 기능을 실행하면 바로 이미지 분석 화면으로 이동하고, 팝업창이 열립니다.

---

3. 코드 편집 영역

코드 영역은 순서도와 실시간으로 연동되는 Python 코드를 보여주는 공간입니다. [메인] 탭과 [사용자 정의 함수] 탭으로 구성됩니다.

3.1. 메인

순서도에 배치된 모듈들이 실제 어떤 코드로 실행되는지 보여주고 디버깅 시 코드의 흐름을 추적할 수 있습니다.

• 접기/펼치기: 코드 좌측의 +, - 아이콘을 클릭하여 함수나 클래스 단위로 코드를 접거나 펼쳐 가독성을 높일 수 있습니다.

• 중단점 설정: F9 키를 눌러 중단점을 설정/해제할 수 있습니다. 중단점이 설정된 라인은 빨간색으로 표시됩니다.

  

• 현재 실행 위치: 디버깅이 일시 정지된 라인은 초록색으로 강조 표시됩니다.

  

• 우클릭 옵션 : 코드에서 우클릭하면 다양한 편의 기능을 사용할 수 있습니다.

  • 모듈 순서도에서 확인: 순서도 창 내 Recipe에서 선택한 라인의 모듈 위치로 이동합니다.
  • 시작: Recipe를 디버깅 없이 실행합니다.
  • 디버깅/계속: 디버깅을 시작하거나 디버깅 중인 Recipe를 계속 실행합니다.
  • 프로시져 단위 실행: 프로시져 단위로 코드를 실행합니다.
  • 한 단계씩 코드 실행: 한 단계씩 코드를 실행합니다.
  • 커서 위치로 실행점 이동: 코드의 커서 위치로 현재 Recipe의 실행점을 이동합니다.
  • 선택한 줄 실행: 코드에서 선택한 라인의 Recipe를 실행합니다.
  • 중단점 추가/삭제: 코드의 라인을 선택하고 해당 라인에 중단점을 추가하거나 삭제합니다.
  • 중단점 전체 삭제: 코드의 모든 중단점을 한번에 삭제합니다.
  • 복사하기: 복사할 함수 코드 라인이나 영역을 커서나 블록으로 지정하여 해당 코드를 복사합니다.

3.2. 사용자 정의 함수

Recipe의 사용자 모듈을 추가했을 때 해당 모듈의 사용자 정의 함수를 확인하거나 새로운 함수형 코드를 직접 작성하고 수정할 수 있습니다. 해당 화면에서 추가한 사용자 모듈을 순서도 내 Recipe에 실시간으로 반영할 수도 있습니다.

• 코드 자동 완성 : 코드를 추가하거나 수정하고 싶은 영역에서 mpp.을 작성하면 나타나는 모듈을 선택할 수 있습니다. 선택한 모듈 뒤에 마침표를 삽입하면 해당 모듈의 함수(API)를 선택하여 코드를 자동 완성할 수 있습니다. 해당 함수(API)에 대한 상세한 설명 또한 함께 확인이 가능합니다.

  

• 우클릭 옵션

  • 정의로 이동: 변경된 사용자 정의 함수 위치에서 기존의 정의 함수 위치로 이동합니다.
  • 모듈 삭제: 사용자 정의 함수 내 선택한 모듈을 삭제합니다. 모듈 함수의 Header 부분을 클릭한 상태여야만 삭제가 가능합니다.
  • 선택한 줄 주석 설정: 함수 코드 라인에 커서를 놓거나 영역을 블록 지정하여 선택한 부분만 주석 처리를 설정합니다.
  • 선택한 줄 주석 해제: 함수 코드 라인에 커서를 놓거나 영역을 블록 지정하여 선택한 부분만 주석 처리를 해제합니다.
  • 선택한 줄 내어쓰기: 함수 코드 라인에 커서를 놓거나 영역을 블록 지정하여 내어쓰기를 적용합니다.
  • 선택한 줄 들여쓰기: 함수 코드 라인에 커서를 놓거나 영역을 블록 지정하여 들여쓰기를 적용합니다.
  • 붙여넣기: 복사한 해당 코드 내용을 원하는 위치에 붙여넣습니다.
  • 복사/붙여넣기: 복사할 함수 코드 라인이나 영역에서 해당 기능을 클릭하면 복사와 붙여넣기를 한번에 실행합니다.